<template>
	<div id="Todolist">
		<el-card class="box-card">
			<div slot="header" class="clearfix">
				<span>待办</span>
			</div>
			<el-table
				:data="tableData"
				style="width: 100%;margin-bottom: 20px;"
				row-key="WorkID"
				default-expand-all
				:row-class-name="tableRowClassName"
				:tree-props="{children: 'children', hasChildren: 'hasChildren'}">
				<el-table-column
					prop="Title"
					label="标题"
					fixed width="350">
					<template slot-scope="scope">
						<span v-if="scope.row.type!=null">{{scope.row.Title}}</span>
						<span v-else><el-link  :underline="false" @click="sikpMyflow(scope.row)">{{scope.row.Title}}</el-link></span>
					</template>

				</el-table-column>
				<el-table-column
					prop="NodeName"
					label="节点"
					width="150">
				</el-table-column>
				<el-table-column
					prop="StarterName"
					label="发起人"
					width="80">
				</el-table-column>
				<el-table-column
					prop="RDT"
					label="发起日期"
					width="150">
				</el-table-column>
				<el-table-column
					prop="ADT"
					label="送达日期"
					width="150">
				</el-table-column>
				<el-table-column
					prop="SDT"
					label="期限"
					width="160">
				</el-table-column>
				<el-table-column
					prop="ZT"
					label="状态"
					width="55">
					<template slot-scope="scope">
						<span v-if="scope.row.ZT==0" style="color:green">正常</span>
						<span v-else-if="scope.row.ZT==1" style="color:#ffac38">警告</span>
						<span v-else-if="scope.row.ZT==2" style="color:red">逾期</span>
					</template>
				</el-table-column>
				<el-table-column
						prop="WFState"
						label="类型">
					<template slot-scope="scope">
						<span v-if="scope.row.WFState==1">草稿</span>
						<span v-else-if="scope.row.WFState==2">运行中</span>
						<span v-else-if="scope.row.WFState==3">已完成</span>
						<span v-else-if="scope.row.WFState==4">挂起</span>
						<span v-else-if="scope.row.WFState==5" style="color:red">退回</span>
						<span v-else-if="scope.row.WFState==6">转发</span>
						<span v-else-if="scope.row.WFState==7">删除</span>
						<span v-else-if="scope.row.WFState==8">加签</span>
						<span v-else-if="scope.row.WFState==11">加签回复</span>
						<span v-else-if="scope.row.WFState==null"></span>
						<span v-else>其他</span>
					</template>
				</el-table-column>
				<el-table-column
						prop="PRI"
						label="优先级"
						width="65">
					<template slot-scope="scope">
						<img v-if="scope.row.PRI==0" title='低' src='../assets/PRI/0.png' />
						<img v-if="scope.row.PRI==1" title='中' src='../assets/PRI/1.png' />
						<img v-if="scope.row.PRI==2" title='高' src='../assets/PRI/2.png' />
					</template>
				</el-table-column>
			</el-table>
            <div style="margin:10px 0;">
                <span style="font-weight: 500;font-size: 14px;margin-right:10px;color: #606266;">合计： {{count}}条</span>

            </div>
		</el-card>
	</div>
</template>

<script>
export default {
	name: "Todolist",
	components: {},

	data() {
		return {
			title: "待办",
			tableData: [],
			count:0,
		};
	},

	beforeCreate() {},

	created() {
		this.loadData();
	},

	methods: {
		tableRowClassName({row}) {
			if (row.type === null)
				return '';

			if (row.type === 1) {
				return 'success-row';
			}
			return '';
		},
		// 获取数据
		loadData() {
			let handler = new this.HttpHandler("BP.WF.HttpHandler.WF");
			handler.AddUrlData();
            let data = handler.DoMethodReturnString("Todolist_Init");
            if(data.indexOf("err@")!=-1){
				this.$message.error(data);
				console.log(data);
				return;
			}
			this.filterData(JSON.parse(data));
		},

		// 过滤数据
		filterData(data) {
            console.log(data);
            this.count = data.length;
            var flowNos="";
			data.forEach(item => {
				if(flowNos.indexOf(item.FK_Flow+",")==-1){
					this.tableData.push({
						Title:item.FlowName,
						WorkID:parseInt(item.FK_Flow),
						type:1,//流程
						children:this.GetChildren(item.FK_Flow,data)
					});
					flowNos+=item.FK_Flow+",";
				}

			});


			console.log(this.tableData);
		},
		GetChildren(flowNo,gwfs){
			var data=[];
			gwfs.forEach(item => {
				var paras = item.AtPara;
				if (paras == null)
					paras = "";
				//判断期限是否少于三天，加警告颜色
				var date = new Date();
				var edt = item.SDT.replace(/\-/g, "/");
				edt = new Date(Date.parse(edt.replace(/-/g, "/")));
				var passTime = edt.getTime() - date.getTime();
				//判断流程是否逾期
				if (date.getTime() > edt.getTime() && item.WFState == 2 && item.FK_Node!=parseInt(item.FK_Flow)+"01" && item.RDT != item.SDT
						&& paras.indexOf("&IsCC=1") == -1) {
					item.ZT=2;
				}
				else {
					if (passTime >= 0 && passTime < 2 * 24 * 3600 * 1000) {
						item.ZT=1;
					} else {
						item.ZT=0;
					}
				}
				if(item.FK_Flow==flowNo){
					data.push(item);
				}

			});
			return data;
		},

		//跳转myflow
		sikpMyflow(work){
			console.log(work);
			let params = {

				IsRead: work.IsRead,
				FK_Flow: work.FK_Flow,
				FK_Node : work.FK_Node,
				FID : work.FID,
				WorkID : work.WorkID,
				PWorkID : work.PWorkID,
				Paras : work.AtPara ? work.AtPara : '',
			}
			// eslint-disable-next-line no-constant-condition
			while (true) {
				params.Paras = params.Paras.replace('@', '&');

				if (params.Paras.indexOf('@') < 0) {
					break;
				}
			}
			params.Paras = "1" + params.Paras;
			console.log(params);
			params.FromPage = 'Todolist';
			// this.$router.push("myFlow?FK_Flow=350");
			this.$router.push({name:"myflow",params});
		},
	},

	//监听
	computed: {},

	//监听后执行动作
	watch: {}
};
</script>

<style>
	.el-table .success-row {
		background: #f0f9eb;
	}
</style>